<!DOCTYPE html>
<!-- saved from url=(0059)http://192.168.3.4:15670/web-stomp-examples/temp-queue.html -->
<html><head><meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<script type="text/javascript" src="lib/jquery/1.9.1/jquery.min.js"></script> 
<script type="text/javascript" src="lib/stomp.js"></script> 
  <style>
      .box {
          width: 440px;
          float: left;
          margin: 0 20px 0 20px;
      }

      .box div, .box input {
          border: 1px solid;
          -moz-border-radius: 4px;
          border-radius: 4px;
          width: 100%;
          padding: 5px;
          margin: 3px 0 10px 0;
      }

      .box div {
          border-color: grey;
          height: 300px;
          overflow: auto;
      }

      div code {
          display: block;
      }

      #first div code {
          -moz-border-radius: 2px;
          border-radius: 2px;
          border: 1px solid #eee;
          margin-bottom: 5px;
      }

      #second div {
          font-size: 0.8em;
      }
  </style>
  <title>RabbitMQ Web STOMP Examples : Temporary Queue</title>
  <link href="./RabbitMQ Web STOMP Examples _ Temporary Queue_files/main.css" rel="stylesheet" type="text/css">
</head><body lang="en">
    <h1><a href="http://192.168.3.4:15670/web-stomp-examples/index.html">RabbitMQ Web STOMP Examples</a> &gt; Temporary Queue</h1>

    <p>When you type text in the form's input, the application will send a message to the <code>/queue/test</code> destination
      with the <code>reply-to</code> header set to <code>/temp-queue/foo</code>.</p>
    <p>The STOMP client sets a default <code>onreceive</code> callback to receive messages from this temporary queue and display the message's text.</p>
    <p>Finally, the client subscribes to the <code>/queue/test</code> destination. When it receives message from this destination, it reverses the message's
       text and reply by sending the reversed text to the destination defined by the message's <code>reply-to</code> header.</p>

    <div id="first" class="box">
      <h2>Received</h2>
      <div></div>
      <form><input autocomplete="off" placeholder="Type here..."></form>
    </div>

    <div id="second" class="box">
      <h2>Logs</h2>
      <div></div>
    </div>

    <script>
      // var ws = new WebSocket('ws://' + window.location.hostname + ':15674/ws');
	  var ws = new WebSocket('ws://192.168.3.4:15674/ws');
      var client = Stomp.over(ws);

		var online = true;
      client.debug = function(e) {
        $('#second div').append($("<code>").text(e));
      };
	  
	  setInterval(function() {
		  client.send('online', {"content-type":"text/plain"}, online);
	  }, 3000);

      // default receive callback to get message from temporary queues
      client.onreceive = function(m) {
        $('#first div').append($("<code>").text(m.body));
      }

      var on_connect = function(x) {
          id = client.subscribe("online", function(m) {
            // reply by sending the reversed text to the temp queue defined in the "reply-to" header
            var reversedText = m.body.split("").reverse().join("");
            // client.send('m.headers['reply-to']', {"content-type":"text/plain"}, i);
          });
      };
      var on_error =  function() {
        console.log('error');
      };
      client.connect('guest', 'guest', on_connect, on_error, '/');

      // $('#first form').submit(function() {
      //   var text = $('#first form input').val();
      //   if (text) {
      //     client.send('online', {'reply-to': 'online'}, text);
      //       $('#first form input').val("");
      //     }
      //     return false;
      // });
    </script>

</body></html>